<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<html>
  <head>
    <title>Title</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/lib/layui-v2.6.3/css/layui.css" media="all">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/lib/bootstrap/bootstrap.min.css" media="all">
    <style>
      .layui-form-select {
        width: 100% !important;
      }
      
      .layui-form-select .layui-input {
        height: 32px;
      }
    </style>
  </head>
  <body style="font-size: 0.9rem;" class="m-3">
    <div class="d-flex flex-column layui-form">
      <div class="d-flex mb-4">
        <div class="d-flex col align-items-center">
          <input id="majorId" value="" type="hidden"/>
          <label style="width: 80px;margin: 0px;" class="d-flex align-items-center">所属专业:</label>
          <select name="interest" lay-filter="selectMajor" lay-search>
            <option value=""></option>
            <c:forEach items="${majorAll}" var="item">
              <option value="${item.majorId}">${item.majorName}</option>
            </c:forEach>
          </select>
        </div>
        <div class="d-flex col align-items-center">
          <label style="width: 80px;margin: 0px;" class="d-flex align-items-center">课程名称:</label>
          <input id="courseName" value="" placeholder="请输入课程名称" class="form-control form-control-sm"/>
        </div>
      </div>
      <div class="d-flex mb-4">
        <div class="col d-flex">
          <label style="width: 80px;margin: 0px;" class="d-flex align-items-center">课程编号:</label>
          <input id="courseNum" value="" placeholder="请输入课程编号" class="form-control form-control-sm"/>
        </div>
        <div class="col d-flex">
          <label style="width: 80px;margin: 0px;" class="d-flex align-items-center">课程类型:</label>
          <input type="radio" name="courseType" value="必修" title="必修"/>
          <input type="radio" name="courseType" value="选修" title="选修"/>
        </div>
      </div>
      <div class="d-flex mb-4">
        <div class="col d-flex">
          <label style="width: 80px;margin: 0px;" class="d-flex align-items-center">课程学时:</label>
          <input id="courseCount" value="" placeholder="请输入课程学时" class="form-control form-control-sm"/>
        </div>
        <div class="col d-flex">
          <label style="width: 80px;margin: 0px;" class="d-flex align-items-center">课程学分:</label>
          <input id="coursePoint" value="" placeholder="请输入课程学分" class="form-control form-control-sm"/>
        </div>
      </div>
      <div class="d-flex mb-4">
        <div class="col d-flex align-items-center">
          <label style="width: 80px;margin: 0px;" class="d-flex align-items-center">授课地点:</label>
          <input id="address" value="" placeholder="请输入授课地点" class="form-control form-control-sm"/>
        </div>
        <div class="col d-flex">
          <label style="width: 80px;margin: 0px;" class="d-flex align-items-center">课程简介:</label>
          <textarea id="courseDesc" value="" placeholder="请输入课程简介" class="form-control form-control-sm"></textarea>
        </div>
      </div>
    </div>
    <script src="${pageContext.request.contextPath}/lib/jquery-3.4.1/jquery-3.4.1.min.js" charset="utf-8"></script>
    <script src="${pageContext.request.contextPath}/lib/layui-v2.6.3/layui.js" charset="utf-8"></script>
    <script src="${pageContext.request.contextPath}/js/lay-config.js" charset="utf-8"></script>
    <script src="${pageContext.request.contextPath}/js/http.js" charset="utf-8"></script>
    <script>
        var layer = null;
        layui.use(['layer', 'form'], function () {
            layer = layui.layer;
            var form = layui.form;
            form.on('select(selectMajor)', function (data) {
                //设置选择的班级的id
                console.log(data)
                $("#majorId").val(data.value)
            })
        })

        function addParms() {
            //获取专业的id
            var majorId = $("#majorId").val();
            if (!majorId) {
                layer.msg('请选择专业');
                return;
            }
            //课程名称
            var courseName = $("#courseName").val();
            if (!courseName) {
                layer.msg('请填写课程名称');
                return;
            }
            //课程编号
            var courseNum = $("#courseNum").val();
            if (!courseNum) {
                layer.msg('请填写课程编号');
                return;
            }
            //课程描述
            var courseDesc = $("#courseDesc").val();
            if (!courseDesc) {
                layer.msg('请填写课程描述');
                return;
            }
            //课程类型
            var courseType = $("input[name='courseType']:checked").val();
            if (!courseType) {
                layer.msg('请选择课程类型');
                return;
            }
            //课时
            var courseCount = $("#courseCount").val();
            if (!courseCount) {
                layer.msg('请填写课时');
                return;
            }
            //学分
            var coursePoint = $("#coursePoint").val();
            if (!coursePoint) {
                layer.msg('请填写学分');
                return;
            }
            //学分
            var address = $("#address").val();
            if (!address) {
                layer.msg('请填写授课地址');
                return;
            }
            return {
                majorId: majorId,
                courseName: courseName,
                courseNum: courseNum,
                courseDesc: courseDesc,
                courseType: courseType,
                courseCount: courseCount,
                coursePoint: coursePoint,
                address: address
            }
        }
    </script>
  </body>
</html>
